<template>
  <view class="container">
    <!-- <view class="navbar u-f-ajc">
      <image src="/static/jibei/home/back.png" class="abso_back" mode="widthFix"
        @click="$u.route({type: 'back', delta: 1})"></image>
      <image src="/static/jibei/yue/header.png" mode="widthFix"></image>
    </view> -->

    <view class="content">
      <view class="scroll_box">
        <view class="u-f bi_box">
          <image src="/static/jibei/yue/bi.png" mode=""></image>
          <view class="right_box u-f-ac u-f-column">
            <view>余额</view>
            <view class="price">{{yue}}</view>
          </view>
        </view>

        <view class="items u-f-ac">
          <view class="u-f-ajc" style="width: 50%;">时间</view>
          <view class="u-f-ajc" style="width: 25%;">数量</view>
          <view class="u-f-ajc" style="width: 25%;">明细</view>
        </view>
        <scroll-view scroll-y class="scrolls" @scrolltolower="reachBottom">
          <view class="item_list">
            <view class="items items2 u-f-ac" @click="toarticlexq(value.projectid)" v-for="(value,key) in jfz_out"
              :key="key">
              <view class="u-f-ajc time" style="width: 50%;">{{value.createtime}}</view>
              <view class="u-f-ajc" style="width: 25%;">{{value.num}}</view>
              <view class="u-f-ajc" style="width: 25%;">{{value.remark}}</view>
            </view>
          </view>
        </scroll-view>
      </view>

    </view>

    <view>
      <button @click="totx" type="default"
        style="background-color: #115763;color: #fff;position: fixed;bottom: 0;width: 100%;">立即提现</button>
    </view>
  </view>
</template>

<script>
  import uniLoadMore from '../../../../components/uni-load-more.vue';
  export default {
    components: {
      uniLoadMore
    },
    data() {
      return {
        openid: '',
        out_log: [],
        jfz: '',
        jfz_out: [],
        credit2: [],
        yue: '',

        page: 1,
      }
    },
    onLoad: function(e) {
      uni.showLoading()
      uni.getStorage({
        key: 'openid',
        success: (res) => {
          this.openid = res.data
          // this.getdata()
          this.getdata2()
          //页面一加载时请求一次数据`
          uni.hideLoading()
        },
        fail: () => {
          uni.navigateTo({
            url: '../login/login'
          });
        }
      });
    },
    methods: {
      getdata() {
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=member.credit2&app=1',
          method: 'POST',
          data: {
            'openid': this.openid
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            console.log(res)
            this.credit2 = res.data.credit2
            this.yue = res.data.yue
          },
          fail: () => {},
          complete: () => {}
        });
      },
      getdata2() {
        uni.request({
          url: this.$BASE_URL+'/index.php?i=2&c=entry&m=ewei_shopv2&do=mobile&r=api.index.get_credit2_list&app=1',
          method: 'POST',
          data: {
            'openid': this.openid,
            'page': this.page,
          },
          header: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            console.log(res)
            this.yue = res.data.total
            if (res.data.error == 1) return this.$u.toast(res.data.message)
            if (res.data.error == 0) this.jfz_out.push(...res.data.list)
            // this.jfz = res.data.out_log
          },
          fail: () => {},
          complete: () => {}
        });
      },
      reachBottom() {
        console.log('下拉')
        this.page += 1
        this.getdata2();
      },
      totx() {
        uni.navigateTo({
          url: '../tx/tx'
        })
      }
    },

  }
</script>

<style lang="scss">
  page {
    background-color: #B5C3C7;
  }

  .container {
    width: 100%;
    height: 100vh;
    // background: url(/static/jibei/home/home_bg.png) no-repeat 0 0;
    background-size: cover;
    box-sizing: border-box;
  }

  .navbar {
    width: 100%;
    padding: 140rpx 0 0;

    image {
      width: 80%;
    }
  }

  .content {
    margin-top: 10rpx;
    padding: 0 0 100rpx;

  }

  .scroll_box {
    width: 100%;
    height: 1280rpx;
    // background: url(/static/jibei/yue/kuang.png) no-repeat 0 0;
    background-size: cover;
    box-sizing: border-box;
    padding: 50rpx 70rpx;

    .bi_box {
      // justify-content: center;
      padding: 0 40rpx;

      image {
        width: 180rpx;
        height: 180rpx;
        margin-right: 30rpx;
      }

      .right_box {
        // width: 250rpx;
        flex: 1;
        padding: 20rpx 0 0;
        // background-color: skyblue;
        // opacity: 0.6;
        font-size: 34rpx;
        color: #FFFFFF;

        .price {
          margin-top: 20rpx;
          font-size: 36rpx;
        }
      }
    }

    .scrolls {
      width: 100%;
      height: 930rpx;
      // background-color: skyblue;
      // opacity: 0.6;
      margin-top: -10rpx;
    }

    .items {
      padding: 20rpx 10rpx;
      box-sizing: border-box;

      view {
        color: #FFFFFF;
        font-size: 32rpx;
      }
    }

    .items2 {
      padding: 20rpx 20rpx;
      border-bottom: 2px solid #D59538;

      view {
        font-size: 28rpx;
        // color: #CA2C09;
      }
    }
  }

  .time {
    // padding: 0 30rpx;
    // word-wrap: break-word;
    // word-break: break-all;
  }
</style>
